<template>
	<view class="set_up_container">
		<view class="set_up_box">
			<view class="set_up_all" v-for="(item, index) in setUpList" :key="index" @click="handleChooseSetUp(item)">
				<view class="set_up_name">
					{{item.name}}
				</view>
				<view class="set_up_icon_box">
					<image src="/static/my/icon-arrow-right.png" mode="" class="set_up_icon"></image>
				</view>
			</view>
		</view>

		<!-- 修改密码弹窗 -->
		<change-password ref="refChangePwd" @handleSubmit="handleSubmit" />
	</view>
</template>

<script>
	import ChangePassword from './components/changePassword.vue'
	export default {
		components: {
			ChangePassword
		},
		data() {
			return {
				setUpList: [{
					id: 0,
					name: '清理缓存'
				}, {
					id: 1,
					name: '修改密码'
				}]
			}
		},
		methods: {
			// 点击
			handleChooseSetUp(val) {
				if (val.name == '清理缓存') {
					uni.showModal({
						title: '提示',
						content: '是否确定清理缓存',
						success: function(res) {
							if (res.confirm) {
								uni.showLoading({
									title: '正在清理'
								})

								setTimeout(() => {
									uni.hideLoading()
									uni.showToast({
										title: '清理成功',
										icon: 'success'
									})
								}, 1200)

							} else if (res.cancel) {

							}
						}
					})
				} else if (val.name == '修改密码') {
					this.$refs.refChangePwd.showChangePwd = true
				}
			},

			// 修改密码接口
			changePassword(val) {
				const that = this
				this.$request('/api/changePassword', {
					old_pwd: val.old_pwd,
					new_pwd: val.new_pwd
				}, 'POST').then(res => {
					if (res.code == 1) {
						uni.showToast({
							title: '修改成功',
							icon: 'none',
							success: res => {
								setTimeout(() => {
									that.$refs.refChangePwd.showChangePwd = false
									uni.switchTab({
										url: '/pages/my/my'
									})
								}, 1200)
							}
						})
					} else {
						uni.showToast({
							title: res.msg,
							icon: 'none'
						})
						return
					}
				})
			},

			// 点击提交
			handleSubmit(val) {
				this.changePassword(val)
			}
		}
	}
</script>

<style lang="scss" scoped>
	.set_up_container {
		padding: 20rpx;

		.set_up_box {

			.set_up_all {
				display: flex;
				align-items: center;
				justify-content: space-between;
				background: #FFFFFF;
				box-shadow: 0px 5rpx 4rpx 0px #F4F4F4;
				border-radius: 12rpx;
				padding: 20rpx 20rpx;
				margin-bottom: 20rpx;

				.set_up_name {
					font-family: all-font;
					font-weight: 500;
					font-size: 30rpx;
					color: #333333;
				}

				.set_up_icon_box {
					width: 35rpx;
					height: 35rpx;

					.set_up_icon {
						width: 100%;
						height: 100%;
					}
				}
			}
		}
	}
</style>